<template>
  <el-dialog :visible.sync="show" title="支付" width="400px">
    <div>
      <p>支付金额: {{ amount }}元</p>
      <span slot="footer" class="dialog-footer">
        <el-button @click="handleClose">关闭</el-button>
      </span>
    </div>
  </el-dialog>
</template>

<script setup>
import { ref, defineProps, defineEmits } from 'vue';

const props = defineProps(['amount']);
const emit = defineEmits(['close']);
const show = ref(false);

watch(() => props.amount, (newAmount) => {
  if (newAmount) {
    show.value = true; // 根据金额显示弹窗
  }
});

const handleClose = () => {
  show.value = false;
  emit('close');
};
</script>
